/**
 * Tabs
 * @authors of1448
 * @date 2017/5/23 17:38
 * @version 1.0
 * @last-modify of1448
 */

import React, { Component } from 'react';
import { Map } from 'immutable';

import WebApi from '../webapi'

export default class Counts extends Component {

    constructor(props) {
        super(props);
        this.state = {
            counts: {
                all: 0,
                noReply: 0,
                isReply: 0
            },
            list: [
                { key: 'all', text: '消息总数' },
                { key: 'noReply', text: '未回复消息数' },
                { key: 'star', text: '已收藏消息数' }
            ]
        }
    }

    async componentDidMount() {
        this.setState({ counts: await WebApi.getCounts() });
    }

    render() {

        let { counts, list } = this.state;

        return (
            <div className="counts">
                {
                    list.map(o => (
                        <div className="count" >
                            <div className="value">{counts[o.key] || 0}</div>
                            <div className="text">{o.text}</div>
                        </div>
                    ))
                }
            </div>
        )
    }

}